<script lang="ts" setup>


import { Page, useVbenModal } from '@vben/common-ui'
import {reactive, ref, watch} from "vue";
import {Descriptions} from "ant-design-vue";
import Handsontable from "handsontable";
import { HotTable } from '@handsontable/vue3'
import 'handsontable/dist/handsontable.full.css'
type EmitEvents = {
  close: {};
};
const emit = defineEmits<EmitEvents>();

const warehouseData = [
  '广州云仓',
  '南昌云仓',
  '长沙云仓',
  '贵阳云仓',
  '武汉云仓',
  '西安云仓'
]

const fields = [
  {data: 'first'},
  {data: 'second'},
  {data: 'third'},
  {data: 'fourth'},
  {data: 'fifth'},
  {data: 'sixth'},
  {data: 'seventh'},
  {data: 'eighth'},
  {data: 'ninth'},
  {data: 'tenth'},
  {data: 'eleven'},
  {data: 'twelve'},
]
const showStock = reactive({
  showData: false,
  totalData: ref([]),
  data: ref([]),
  avgData:ref([]),
  stockData:ref([]),
  currentIndex: ref(0),
  total: 0,
  currentPage: 1,
  quickSearch: "",
  goods_no:"",
  category_name:"",
  style_category_name:"",
  time_category_name:"",
  shipping_remark:"",
  goods_code:"",
  retailData: ref([]),
  warehouseTotalData: ref([]),
  purchase_type_text:"",
  remark:"",
  warehouse_total_data:""
});

const hotTableComponent = ref<any>(null);
const saleTableComponent = ref<any>(null);
const avgTableComponent = ref<any>(null);
const totalTableComponent = ref<any>(null);
const stockTableComponent = ref<any>(null);
const warehouseTotalTableComponent = ref<any>(null);
const showConfirm = ref(false)
const highlight = reactive({
  row: undefined,
  col:undefined
});
const hotSettings = {
  contextMenu: { // 单元格右击展示菜单
    items: {
      separator: Handsontable.plugins.ContextMenu.SEPARATOR,
    },
  },
  afterChange: function (change, source) {
    if (source == 'loadData') {
      return
    }
    change.forEach((row,i) => {
      const index = row[0]
      const field = row[1]
      // 直接设置新值，避免差值计算导致的重复累加
      const newNum = row[3] == null ? 0 : row[3]
      showStock.stockData[index][field] = newNum
      let total = 0;
      fields.forEach((r,i) => {
        total = total + showStock.stockData[index][r.data]
        showStock.stockData[index].total = total
      })
    })

    initCurrentNum()
    console.log(totalTableComponent)
    if (totalTableComponent.value !== null) {
      totalTableComponent.value.hotInstance.loadData(showStock.totalData)
    }

  },
  cells: function (row, col, prop) {
    let cellProperties = {};
    cellProperties.renderer = "negativeValueRenderer";
    return cellProperties;
  },
  afterSelection(row, col, row2, col2) {
    highlight.row = row
    highlight.col = col
    if (avgTableComponent.value !== null) {
      avgTableComponent.value.hotInstance.loadData(showStock.avgData)
    }
    if(stockTableComponent.value !== null) {
      stockTableComponent.value.hotInstance.loadData(showStock.stockData)
    }
  },
  fillHandle: 'vertical', // 是否开启拖拽复制操作(true,false,'horizontal'水平复制,'vertical'垂直复制)
  width: '100%',
  height:'250',
  licenseKey: '2280d-dad74-843c8-51a09-b5218',
  colHeaders: [

    "上<br>柜<br>数<br>",
    "仓库",
    "28<br>46<br>165<br>37<br>S",
    "29<br>48<br>170<br>38<br>M",
    "30<br>50<br>175<br>39<br>L",
    "31<br>52<br>180<br>40<br>XL",
    "32<br>54<br>185<br>41<br>2XL",
    "33<br>56<br>190<br>42<br>3XL",
    "34<br>58<br>195<br>43<br>4XL",
    "35<br><br><br><br>5XL",
    "36<br><br><br><br>6XL",
    "38<br><br><br><br>7XL",
    "40",
    "42<br>均码",
    "铺货备注",
    "窗口<br>等级<br>备注",
    "合计",
  ],
  copyable: true, // 允许键盘复制
  copyPaste: true, //复制粘贴
  colWidths: 130,
  manualColumnResize: true,
  columns: [
    {data: 'shop_num', width:40 , type: 'numeric'},
    {data: 'warehouse', width:70},
    {data: 'first', width:40  , type: 'numeric'},
    {data: 'second', width:40, type: 'numeric'},
    {data: 'third', width:40, type: 'numeric'},
    {data: 'fourth', width:40, type: 'numeric'},
    {data: 'fifth', width:40, type: 'numeric'},
    {data: 'sixth', width:40, type: 'numeric'},
    {data: 'seventh', width:40, type: 'numeric'},
    {data: 'eighth', width:40, type: 'numeric'},
    {data: 'ninth', width:40, type: 'numeric'},
    {data: 'tenth', width:40, type: 'numeric'},
    {data: 'eleven', width:40, type: 'numeric'},
    {data: 'twelve', width:40, type: 'numeric'},
    {data: 'shipping_remark', width:80},
    {data: 'window_level_remark', width:70},
    {data: 'total', width:50, type: 'numeric'},

  ],
}
const saleSettings = {
  contextMenu: { // 单元格右击展示菜单
    items: {
      separator: Handsontable.plugins.ContextMenu.SEPARATOR,
    },
  },
  fillHandle: 'vertical', // 是否开启拖拽复制操作(true,false,'horizontal'水平复制,'vertical'垂直复制)
  width: '100%',
  height: 260,
  licenseKey: '2280d-dad74-843c8-51a09-b5218',
  colHeaders: [
    "仓库",
    "28<br>46<br>165<br>37<br>S",
    "29<br>48<br>170<br>38<br>M",
    "30<br>50<br>175<br>39<br>L",
    "31<br>52<br>180<br>40<br>XL",
    "32<br>54<br>185<br>41<br>2XL",
    "33<br>56<br>190<br>42<br>3XL",
    "34<br>58<br>195<br>43<br>4XL",
    "35<br><br><br><br>5XL",
    "36<br><br><br><br>6XL",
    "38<br><br><br><br>7XL",
    "40",
    "42<br>均码",
    "合计",
  ],
  copyable: true, // 允许键盘复制
  copyPaste: true, //复制粘贴
  colWidths: 130,
  manualColumnResize: true,
  cells: function (row, col, prop) {
    let cellProperties = {};
    cellProperties.renderer = "negativeValueRenderer";
    return cellProperties;
  },
  columns: [
    {data: 'warehouse', width:70},
    {data: 'first', width:40  , type: 'numeric'},
    {data: 'second', width:40, type: 'numeric'},
    {data: 'third', width:40, type: 'numeric'},
    {data: 'fourth', width:40, type: 'numeric'},
    {data: 'fifth', width:40, type: 'numeric'},
    {data: 'sixth', width:40, type: 'numeric'},
    {data: 'seventh', width:40, type: 'numeric'},
    {data: 'eighth', width:40, type: 'numeric'},
    {data: 'ninth', width:40, type: 'numeric'},
    {data: 'tenth', width:40, type: 'numeric'},
    {data: 'eleven', width:40, type: 'numeric'},
    {data: 'twelve', width:40, type: 'numeric'},
    {data: 'total', width:50, type: 'numeric'},

  ],
}
const totalSettings = {
  contextMenu: { // 单元格右击展示菜单
    items: {
      separator: Handsontable.plugins.ContextMenu.SEPARATOR,
    },
  },
  afterChange: function (change, source) {
    if (source == 'loadData') {
      return
    }
  },
  fillHandle: 'vertical', // 是否开启拖拽复制操作(true,false,'horizontal'水平复制,'vertical'垂直复制)
  width: '100%',
  height: 130,
  licenseKey: '2280d-dad74-843c8-51a09-b5218',
  colHeaders: [
    "上<br>柜<br>数<br>",
    "合计",
    "28<br>46<br>165<br>37<br>S",
    "29<br>48<br>170<br>38<br>M",
    "30<br>50<br>175<br>39<br>L",
    "31<br>52<br>180<br>40<br>XL",
    "32<br>54<br>185<br>41<br>2XL",
    "33<br>56<br>190<br>42<br>3XL",
    "34<br>58<br>195<br>43<br>4XL",
    "35<br><br><br><br>5XL",
    "36<br><br><br><br>6XL",
    "38<br><br><br><br>7XL",
    "40",
    "42<br>均码",
  ],
  cells: function (row, col, prop) {
    let cellProperties = {};
    cellProperties.renderer = "negativeValueRenderer1";
    return cellProperties;
  },
  copyable: true, // 允许键盘复制
  copyPaste: true, //复制粘贴
  colWidths: 130,
  manualColumnResize: true,
  columns: [
    {data: 'shop_num', width:40},
    {data: 'warehouse', width:70},
    {data: 'first', width:40},
    {data: 'second', width:40},
    {data: 'third', width:40},
    {data: 'fourth', width:40},
    {data: 'fifth', width:40},
    {data: 'sixth', width:40},
    {data: 'seventh', width:40},
    {data: 'eighth', width:40},
    {data: 'ninth', width:40},
    {data: 'tenth', width:40},
    {data: 'eleven', width:40},
    {data: 'twelve', width:40},
  ],
}
const stockSettings = {
  contextMenu: { // 单元格右击展示菜单
    items: {
      separator: Handsontable.plugins.ContextMenu.SEPARATOR,
    },
  },
  afterChange: function (change, source) {
    if (source == 'loadData') {
      return
    }
  },
  cells: function (row, col, prop) {
    let cellProperties = {};
    cellProperties.renderer = "negativeValueRenderer2";
    return cellProperties;
  },
  readOnly:true,
  fillHandle: 'vertical', // 是否开启拖拽复制操作(true,false,'horizontal'水平复制,'vertical'垂直复制)
  width: '100%',
  height: 250,
  licenseKey: '2280d-dad74-843c8-51a09-b5218',
  colHeaders: [
    "上<br>柜<br>数<br>",
    "合计",
    "28<br>46<br>165<br>37<br>S",
    "29<br>48<br>170<br>38<br>M",
    "30<br>50<br>175<br>39<br>L",
    "31<br>52<br>180<br>40<br>XL",
    "32<br>54<br>185<br>41<br>2XL",
    "33<br>56<br>190<br>42<br>3XL",
    "34<br>58<br>195<br>43<br>4XL",
    "35<br><br><br><br>5XL",
    "36<br><br><br><br>6XL",
    "38<br><br><br><br>7XL",
    "40",
    "42<br>均码",
    '合计'
  ],
  copyable: true, // 允许键盘复制
  copyPaste: true, //复制粘贴
  colWidths: 130,
  manualColumnResize: true,
  columns: [
    {data: 'shop_num', width:40 , type: 'numeric'},
    {data: 'warehouse', width:70},
    {data: 'first', width:40  , type: 'numeric'},
    {data: 'second', width:40, type: 'numeric'},
    {data: 'third', width:40, type: 'numeric'},
    {data: 'fourth', width:40, type: 'numeric'},
    {data: 'fifth', width:40, type: 'numeric'},
    {data: 'sixth', width:40, type: 'numeric'},
    {data: 'seventh', width:40, type: 'numeric'},
    {data: 'eighth', width:40, type: 'numeric'},
    {data: 'ninth', width:40, type: 'numeric'},
    {data: 'tenth', width:40, type: 'numeric'},
    {data: 'eleven', width:40, type: 'numeric'},
    {data: 'twelve', width:40, type: 'numeric'},
    {data: 'total', width:50, type: 'numeric'},
  ],
}
const avgSettings = {
  contextMenu: { // 单元格右击展示菜单
    items: {
      separator: Handsontable.plugins.ContextMenu.SEPARATOR,
    },
  },
  afterChange: function (change, source) {
    if (source == 'loadData') {
      return
    }
  },
  cells: function (row, col, prop) {
    let cellProperties = {};
    cellProperties.renderer = "negativeValueRenderer2";
    return cellProperties;
  },
  fillHandle: 'vertical', // 是否开启拖拽复制操作(true,false,'horizontal'水平复制,'vertical'垂直复制)
  width: '100%',
  height: 250,
  licenseKey: '2280d-dad74-843c8-51a09-b5218',
  colHeaders: [
    "上<br>柜<br>数<br>",
    "合计",
    "28<br>46<br>165<br>37<br>S",
    "29<br>48<br>170<br>38<br>M",
    "30<br>50<br>175<br>39<br>L",
    "31<br>52<br>180<br>40<br>XL",
    "32<br>54<br>185<br>41<br>2XL",
    "33<br>56<br>190<br>42<br>3XL",
    "34<br>58<br>195<br>43<br>4XL",
    "35<br><br><br><br>5XL",
    "36<br><br><br><br>6XL",
    "38<br><br><br><br>7XL",
    "40",
    "42<br>均码",
    "店均"
  ],
  copyable: true, // 允许键盘复制
  copyPaste: true, //复制粘贴
  colWidths: 130,
  manualColumnResize: true,
  columns: [
    {data: 'shop_num', width:40},
    {data: 'warehouse', width:70},
    {data: 'first', width:40},
    {data: 'second', width:40},
    {data: 'third', width:40},
    {data: 'fourth', width:40},
    {data: 'fifth', width:40},
    {data: 'sixth', width:40},
    {data: 'seventh', width:40},
    {data: 'eighth', width:40},
    {data: 'ninth', width:40},
    {data: 'tenth', width:40},
    {data: 'eleven', width:40},
    {data: 'twelve', width:40},
    {data: 'total', width:40},
  ],
}
const wareSettings = {
  contextMenu: { // 单元格右击展示菜单
    items: {
      separator: Handsontable.plugins.ContextMenu.SEPARATOR,
    },
  },
  fillHandle: 'vertical', // 是否开启拖拽复制操作(true,false,'horizontal'水平复制,'vertical'垂直复制)
  width: '100%',
  height: 150,
  licenseKey: '2280d-dad74-843c8-51a09-b5218',
  colHeaders: [
    "广州云仓",
    "南昌云仓",
    "长沙云仓",
    "贵阳云仓",
    "武汉云仓",

    "西安云仓",
    "合计",
  ],
  cells: function (row, col, prop) {
    let cellProperties = {};
    cellProperties.renderer = "negativeValueRenderer";
    return cellProperties;
  },
  afterChange: function (change, source) {
    if (source == 'loadData') {
      return
    }
    // console.log(showStock.warehouseTotalData)
    showStock.warehouseTotalData[0].num_total = parseInt(showStock.warehouseTotalData[0].num_66 == null ? '0' : showStock.warehouseTotalData[0].num_66) + parseInt(showStock.warehouseTotalData[0].num_38 == null ? '0' : showStock.warehouseTotalData[0].num_38) + parseInt(showStock.warehouseTotalData[0].num_39 == null ? '0' : showStock.warehouseTotalData[0].num_39) + parseInt(showStock.warehouseTotalData[0].num_40 == null ? '0' : showStock.warehouseTotalData[0].num_40) + parseInt(showStock.warehouseTotalData[0].num_36 == null ? '0' : showStock.warehouseTotalData[0].num_36) + parseInt(showStock.warehouseTotalData[0].num_37 == null ? '0' : showStock.warehouseTotalData[0].num_37)
    warehouseTotalTableComponent.value.hotInstance.loadData(showStock.warehouseTotalData)
  },
  copyable: true, // 允许键盘复制
  copyPaste: true, //复制粘贴
  colWidths: 130,
  manualColumnResize: true,
  columns: [
    {data: 'num_38', width:70},
    {data: 'num_36', width:70},
    {data: 'num_40', width:70},
    {data: 'num_37', width:70},
    {data: 'num_39', width:70},
    {data: 'num_66', width:70},
    {data: 'num_total', width:50},
  ],
}
const initCurrentNum = () => {
  if (showStock.data == undefined) {
    return
  }

  let total_avg_shop_num : number | string = 0;
  let total_stock = []
  let total_avg = []
  let total = [];
  fields.forEach((r,i) => {
    total_stock[r.data] = 0;
    total_avg[r.data] = 0;
    total[r.data] = 0;
  })
  let total_stock_num = 0
  let max_index = 6;
  showStock.data.forEach((row, index) => {
    let index_total = 0
    if (row.warehouse !== "合计") {
      fields.forEach((r,i) => {
        index_total = index_total + parseInt((row[r.data] == '' || row[r.data] == null)  ? 0 : row[r.data])
        total[r.data] = total[r.data] + parseInt((row[r.data] == '' || row[r.data] == null)  ? 0 : row[r.data])
      })
      fields.forEach((r,i) => {
        showStock.data[max_index][r.data] = total[r.data]
      })
    } else {
      fields.forEach((r,i) => {
        index_total = index_total + parseInt((row[r.data] == '' || row[r.data] == null)  ? 0 : row[r.data])
      })
    }
    showStock.data[index].total = index_total
    let shop_num = showStock.data[index].shop_num <= 0 ? 0 : showStock.data[index].shop_num

    if (index < max_index) {
      showStock.avgData[index].shop_num = shop_num
      showStock.stockData[index].shop_num = shop_num
      fields.forEach((r,i) => {
        showStock.avgData[index][r.data] = shop_num <= 0 ? 0 : ((showStock.stockData[index][r.data]) / shop_num).toFixed(1)
        total_stock[r.data] = total_stock[r.data] + showStock.stockData[index][r.data]
        showStock.stockData[max_index][r.data] = total_stock[r.data]
        total_stock_num = total_stock_num+showStock.stockData[index][r.data]
      })
      showStock.avgData[index]['total'] = shop_num <= 0 ? 0 : (showStock.stockData[index]['total']  / shop_num).toFixed(1)
      showStock.stockData[max_index]['total'] = total_stock_num
    } else {
      total_avg_shop_num = total_avg_shop_num + parseInt(shop_num)

      console.log('total_avg_shop_num',total_avg_shop_num)
      fields.forEach((r,i) => {
        total_avg[r.data] = total_avg_shop_num <= 0 ? 0 : ((showStock.stockData[max_index][r.data]) / total_avg_shop_num).toFixed(1)
        showStock.avgData[max_index][r.data] = total_avg[r.data]
        showStock.totalData[1][r.data] = showStock.data[max_index][r.data] - showStock.totalData[0][r.data]
      })
      showStock.totalData[1]['total'] = showStock.data[max_index]['total'] - showStock.totalData[0]['total']
      showStock.avgData[max_index].shop_num = total_avg_shop_num
      showStock.stockData[max_index].shop_num = total_avg_shop_num
      const avgData_total = showStock.stockData[max_index].total
      showStock.avgData[max_index].total = total_avg_shop_num > 0 ? (avgData_total / showStock.data[max_index].shop_num ).toFixed(1) : 0
    }
  })
}
const view = ref('')
const [Modal, modalApi] = useVbenModal({
  destroyOnClose: true,
  confirmText:'确定',
  fullscreen: true,
  appendToMain: true,
  // showCancelButton:false,
  onCancel() {
    modalApi.close()
  },
  async onConfirm() {
    // if(view.value==='edit'){
      const outData =  JSON.parse(JSON.stringify(showStock.data));
    let total_num = 0
    outData.forEach((row,index) => {
      if(index <6) {
        total_num = total_num + parseInt((row.first == '' || row.first == null) ? 0 : row.first) + parseInt((row.second == '' || row.second == null) ? 0 : row.second) + parseInt((row.third == '' || row.third == null) ? 0 : row.third) + parseInt((row.fourth == '' || row.fourth == null) ? 0 : row.fourth)
        total_num = total_num + parseInt((row.fifth == '' || row.fifth == null) ? 0 : row.fifth) + parseInt((row.sixth == '' || row.sixth == null) ? 0 : row.sixth) + parseInt((row.seventh == '' || row.seventh == null) ? 0 : row.seventh) + parseInt((row.eighth == '' || row.eighth == null) ? 0 : row.eighth)
        total_num = total_num + parseInt((row.ninth == '' || row.ninth == null) ? 0 : row.ninth) + parseInt((row.tenth == '' || row.tenth == null) ? 0 : row.tenth) + parseInt((row.eleven == '' || row.eleven == null) ? 0 : row.eleven) + parseInt((row.twelve == '' || row.twelve == null) ? 0 : row.twelve)
      }
    })
    if (total_num <= 0) {
      total_num = showStock.warehouseTotalData[0].num_total
    }
    emit('close',{total_num:total_num,data:outData})
    // }
    modalApi.close()
  },
  onOpenChange: async (isOpen: boolean) => {
    if (!isOpen) return
    // 先清空数据
    showStock.data = [];
    showStock.totalData = [];
    showStock.stockData = [];
    showStock.avgData = [];
    showStock.warehouseTotalData = [];
    const { rowData ,edit } = modalApi.getData<Record<string, any>>()
    console.log('showStock.data', rowData)
    view.value = edit
    showStock.category_name = rowData.category
    showStock.time_category_name = rowData.time_category_name
    showStock.style_category_name = rowData.style_category_name
    showStock.goods_no = rowData.goods_no
    showStock.goods_code = rowData.goods_code
    showStock.shipping_remark = rowData.shipping_remark
    showStock.purchase_type_text = rowData.purchase_type_text
    showStock.remark = rowData.remark
    let stockTotal =[]
    let stockData = []
    let warehouseTotalData = []
    let stockDetail= []
    stockDetail = rowData.stock_detail
     stockTotal = rowData.total_data
     stockData = rowData.stock_data
     warehouseTotalData = rowData.warehouse_total_data

    if (stockDetail == undefined || stockDetail.length <= 0) {
      warehouseData.forEach((row, index: number) => {
        stockDetail.push({
          warehouse: row,
          shop_num:0,
          first: 0,
          second: 0,
          third: 0,
          fourth: 0,
          fifth: 0,
          sixth: 0,
          seventh: 0,
          eighth: 0,
          ninth: 0,
          tenth: 0,
          eleven: 0,
          twelve: 0,
          total:0
        })
      })
      stockDetail.push({
        warehouse: "合计",
        shop_num:0,
        first: 0,
        second: 0,
        third: 0,
        fourth: 0,
        fifth: 0,
        sixth: 0,
        seventh: 0,
        eighth: 0,
        ninth: 0,
        tenth: 0,
        eleven: 0,
        twelve: 0,
      })
    }
    if (warehouseTotalData == undefined || warehouseTotalData.length <= 0) {
      warehouseTotalData = []
      warehouseTotalData.push({
        num_total: 0,
        num_36:0,
        num_37: 0,
        num_38: 0,
        num_39: 0,
        num_40: 0,
        num_66: 0
      })
    }
    if (showStock.avgData == undefined || showStock.avgData.length <= 0)  {
      warehouseData.forEach((row, index) => {
        showStock.avgData.push({
          warehouse: row,
          shop_num:0,
          first: 0,
          second: 0,
          third: 0,
          fourth: 0,
          fifth: 0,
          sixth: 0,
          seventh: 0,
          eighth: 0,
          ninth: 0,
          tenth: 0,
          eleven: 0,
          twelve: 0,
          total:0
        })
      })
      showStock.avgData.push({
        warehouse: "全国店均",
        shop_num:0,
        first: 0,
        second: 0,
        third: 0,
        fourth: 0,
        fifth: 0,
        sixth: 0,
        seventh: 0,
        eighth: 0,
        ninth: 0,
        tenth: 0,
        eleven: 0,
        twelve: 0,
      })
    }
    if (stockTotal == undefined || stockTotal.length <= 0) {
      stockTotal = []
      stockTotal.push({
        warehouse: "合计",
        shop_num:0,
        first: 0,
        second: 0,
        third: 0,
        fourth: 0,
        fifth: 0,
        sixth: 0,
        seventh: 0,
        eighth: 0,
        ninth: 0,
        tenth: 0,
        eleven: 0,
        twelve: 0
      })
      stockTotal.push({
        warehouse: "差量",
        shop_num:0,
        first: 0,
        second: 0,
        third: 0,
        fourth: 0,
        fifth: 0,
        sixth: 0,
        seventh: 0,
        eighth: 0,
        ninth: 0,
        tenth: 0,
        eleven: 0,
        twelve: 0
      })
    }
    if (stockData == undefined || stockData <= 0)  {
      stockData = []
      warehouseData.forEach((row, index) => {
        stockData.push({
          warehouse: row,
          shop_num:0,
          first: 0,
          second: 0,
          third: 0,
          fourth: 0,
          fifth: 0,
          sixth: 0,
          seventh: 0,
          eighth: 0,
          ninth: 0,
          tenth: 0,
          eleven: 0,
          twelve: 0,
          total:0
        })
      })
      stockData.push({
        warehouse: "合计",
        shop_num:0,
        first: 0,
        second: 0,
        third: 0,
        fourth: 0,
        fifth: 0,
        sixth: 0,
        seventh: 0,
        eighth: 0,
        ninth: 0,
        tenth: 0,
        eleven: 0,
        twelve: 0,
      })
    }

    // showStock.currentIndex = index
    showStock.data = stockDetail
    showStock.totalData = stockTotal
    showStock.stockData = stockData
    showStock.warehouseTotalData = warehouseTotalData
    showStock.retailData = rowData.retail_data
    showStock.showData = true

    Handsontable.renderers.registerRenderer('negativeValueRenderer', negativeValueRenderer)
    Handsontable.renderers.registerRenderer('negativeValueRenderer1', negativeValueRenderer1)
    Handsontable.renderers.registerRenderer('negativeValueRenderer2', negativeValueRenderer2)

    // 强制重新加载所有表格数据
    setTimeout(() => {
      if (hotTableComponent.value !== null) {
        hotTableComponent.value.hotInstance.loadData(showStock.data)
      }
      if (saleTableComponent.value !== null) {
        saleTableComponent.value.hotInstance.loadData(showStock.retailData)
      }
      if (totalTableComponent.value !== null) {
        totalTableComponent.value.hotInstance.loadData(showStock.totalData)
      }
      if (stockTableComponent.value !== null) {
        stockTableComponent.value.hotInstance.loadData(showStock.stockData)
      }
      if (avgTableComponent.value !== null) {
        avgTableComponent.value.hotInstance.loadData(showStock.avgData)
      }
      if (warehouseTotalTableComponent.value !== null) {
        warehouseTotalTableComponent.value.hotInstance.loadData(showStock.warehouseTotalData)
      }
    }, 0)
  },
})
watch(()=>showStock.data, (newValue, oldValue) => {
  initCurrentNum()
})
watch(()=>showStock.warehouseTotalData, (newValue, oldValue) => {
  showStock.warehouse_total_data = showStock.warehouseTotalData
})
const negativeValueRenderer2 = (instance, td, row, col, prop, value, cellProperties) =>  {
  if (row == highlight.row && col == highlight.col) {
    td.className = 'custom-cell';
  }
  if (value <= 0 || value == ""|| value == null || value == 'NAN') {
    td.innerHTML = ""
  } else {
    td.innerHTML = value
  }
}
const negativeValueRenderer = (instance, td, row, col, prop, value, cellProperties) =>  {
  if (value <= 0 || value == ""|| value == null || value == 'NAN') {
    td.innerHTML = ""
  } else {
    td.innerHTML = value
  }
}
const negativeValueRenderer1 = (instance, td, row, col, prop, value, cellProperties) =>  {
  if (showStock.totalData == undefined) {
    return
  }
  fields.forEach((rr, index) => {
    if(showStock.totalData[0][rr.data] != showStock.data[6][rr.data] && (col -2) == index) {
      td.className = 'red-custom-cell';
    }
  })
  if (value == 0 || value == ""|| value == null) {
    td.innerHTML = ""
  } else {
    td.innerHTML = value
  }
}

</script>

<template>
  <Modal>
    <Page content-class="flex flex-col gap-4" description="" title="货品信息">
      <Descriptions :column="5" bordered size="small" :label-style="{ width: '100px' }" :content-style="{ width: '180px' }">
        <Descriptions.Item label="货号">{{showStock.goods_no}}</Descriptions.Item>
        <Descriptions.Item label="简码">{{showStock.goods_code}}</Descriptions.Item>
        <Descriptions.Item label="分类">{{showStock.category_name}}</Descriptions.Item>
        <Descriptions.Item label="波段">{{showStock.time_category_name}}</Descriptions.Item>
        <Descriptions.Item label="等级">{{showStock.style_category_name}}</Descriptions.Item>
        <Descriptions.Item label="类型">{{showStock.purchase_type_text}}</Descriptions.Item>
        <Descriptions.Item label="货铺备注">{{showStock.remark}}</Descriptions.Item>
      </Descriptions>
      <div style="width: 100%;overflow: hidden;">
        <div v-show="showStock.showData" style="float: left;width: 50%;">
          <h2>分仓:</h2>
          <hot-table ref="hotTableComponent" :data="showStock.data"
                     :settings="hotSettings"></hot-table>
        </div>
        <div  v-if="view==='edit'" style="float: right;width: 50%;">
          <h2>店铺销售:</h2>
          <hot-table ref="saleTableComponent" :data="showStock.retailData"
                     :settings="saleSettings"></hot-table>
        </div>
      </div>
      <div style="width: 100%;overflow: hidden;">
        <div style="float: left;width: 50%;">
          <h2  v-if="view==='edit'" >总单:</h2>
          <hot-table v-if="view==='edit'" ref="totalTableComponent" :data="showStock.totalData"
                      :settings="totalSettings"></hot-table>

        </div>
        <div style="float: right;width: 50%;">
          <h2>总分仓:</h2>
          <hot-table ref="warehouseTotalTableComponent" :data="showStock.warehouseTotalData"
                     :settings="wareSettings"></hot-table>
        </div>
      </div>
      <div style="width: 100%;overflow: hidden;">
        <div  v-if="view==='edit'" style="float: left;width: 50%;">
          <h2>生产中+入库+采购在途:</h2>
          <hot-table ref="stockTableComponent" :data="showStock.stockData"
                     :settings="stockSettings"></hot-table>
        </div>
        <div  v-if="view==='edit'" style="float: right;width: 50%;">
          <h2>店均:</h2>
          <hot-table v-if="view==='edit'" ref="avgTableComponent" :data="showStock.avgData"
                     :settings="avgSettings"></hot-table>
        </div>
      </div>

    </Page>
  </Modal>
</template>

<style scoped>
/* 让 Form.Item 不再有默认 margin-bottom */
.mb-0 {
  margin-bottom: 0 !important;
}
</style>
